﻿@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_Form.cshtml";
}
<script>
    var keyValue = $.request("keyValue");
    $(function () {
        if (!!keyValue) {
            $.ajax({
                url: "/Questionnaire/QnQuestion/GetFormJson",
                data: { keyValue: keyValue },
                dataType: "json",
                async: false,
                success: function (data) {
                    $("#form1").formSerialize(data);
                    $("#F_PaperId").hide();
                    $("#F_PaperTitle").show();
                    $("#F_PaperTitle").attr("readonly", "readonly");
                }
            });
        } else {
            $("#F_PaperTitle").hide();
            initControl();
        }

        $("#F_Type").change(function () {
            $("#F_OptionCont").addClass("required").removeClass("error").siblings().remove();
            $("#F_Option1").addClass("required").removeClass("error").siblings().remove();
            $("#F_Option2").addClass("required").removeClass("error").siblings().remove();
            if ($(this).val() == 3) {
                $("#F_OptionCont").val(5).attr("readonly", "readonly");
                $("#F_Option1").val("1分").attr("readonly", "readonly");
                $("#F_Option2").val("2分").attr("readonly", "readonly");
                $("#F_Option3").val("3分").attr("readonly", "readonly");
                $("#F_Option4").val("4分").attr("readonly", "readonly");
                $("#F_Option5").val("5分").attr("readonly", "readonly");
                $("#F_Option6").val("").attr("readonly", "readonly");
                $("#F_Option7").val("").attr("readonly", "readonly");
                $("#F_Option8").val("").attr("readonly", "readonly");
                $("#F_Option9").val("").attr("readonly", "readonly");
                $("#F_Option10").val("").attr("readonly", "readonly");
            } if ($(this).val() == 4) {
                $("#F_OptionCont").removeClass("required");
                $("#F_Option1").removeClass("required");
                $("#F_Option2").removeClass("required");
                $("#F_OptionCont").val(0).attr("readonly", "readonly");
                $("#F_Option1").val("").attr("readonly", "readonly");
                $("#F_Option2").val("").attr("readonly", "readonly");
                $("#F_Option3").val("").attr("readonly", "readonly");
                $("#F_Option4").val("").attr("readonly", "readonly");
                $("#F_Option5").val("").attr("readonly", "readonly");
                $("#F_Option6").val("").attr("readonly", "readonly");
                $("#F_Option7").val("").attr("readonly", "readonly");
                $("#F_Option8").val("").attr("readonly", "readonly");
                $("#F_Option9").val("").attr("readonly", "readonly");
                $("#F_Option10").val("").attr("readonly", "readonly");
            } else {
                $("#F_OptionCont").removeAttr("readonly");
                $("#F_Option1").removeAttr("readonly");
                $("#F_Option2").removeAttr("readonly");
                $("#F_Option3").removeAttr("readonly");
                $("#F_Option4").removeAttr("readonly");
                $("#F_Option5").removeAttr("readonly");
                $("#F_Option6").removeAttr("readonly");
                $("#F_Option7").removeAttr("readonly");
                $("#F_Option8").removeAttr("readonly");
                $("#F_Option9").removeAttr("readonly");
                $("#F_Option10").removeAttr("readonly");
            }
        });

        $("#F_Type").change();
    });
    function initControl() {
        $("#F_PaperId").bindSelect({
            url: "/Questionnaire/QnPaper/GetUnreleaseGridJson",
            param: { keyValue: keyValue },
            id: "F_Id",
            text: "F_Title",
            change: function (data) {
                $("#F_PaperTitle").val(data["F_Title"]);
            }
        });
        $("#F_PaperId").trigger("change");
    }
    function submitForm() {
        if (!$('#form1').formValid()) {
            return false;
        }
        $.submitForm({
            url: "/Questionnaire/QnQuestion/SubmitForm?keyValue=" + keyValue,
            param: $("#form1").formSerialize(),
            success: function () {
                $.currentWindow().$("#gridList").trigger("reloadGrid");
            }
        });
    }
</script>

<form id="form1">
    <div style="padding-top: 20px; margin-right: 20px;">
        <table class="form">
            <tr>
                <th class="formTitle">试卷</th>
                <td class="formValue">
                    <select id="F_PaperId" name="F_PaperId" class="form-control required"></select>
                    <input id="F_PaperTitle" name="F_PaperTitle" type="text" class="form-control required" />
                    <label style="margin-top: 5px; color:#808080;">只能选择未发布且未到有效期的调查问卷</label>
                </td>
            </tr>
            <tr>
                <th class="formTitle">题型</th>
                <td class="formValue">
                    <select id="F_Type" name="F_Type" class="form-control required">
                        <option value="1">单选</option>
                        <option value="2">多选</option>
                        <option value="3">评分</option>
                        <option value="4">问题</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">问题</th>
                <td class="formValue">
                    <input id="F_Question" name="F_Question" type="text" class="form-control required" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">排序</th>
                <td class="formValue">
                    <input id="F_OrderId" name="F_OrderId" type="text" class="form-control required" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项数</th>
                <td class="formValue">
                    <input id="F_OptionCont" name="F_OptionCont" type="text" class="form-control required" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项1</th>
                <td class="formValue">
                    <input id="F_Option1" name="F_Option1" type="text" class="form-control required" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项2</th>
                <td class="formValue">
                    <input id="F_Option2" name="F_Option2" type="text" class="form-control required" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项3</th>
                <td class="formValue">
                    <input id="F_Option3" name="F_Option3" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项4</th>
                <td class="formValue">
                    <input id="F_Option4" name="F_Option4" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项5</th>
                <td class="formValue">
                    <input id="F_Option5" name="F_Option5" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项6</th>
                <td class="formValue">
                    <input id="F_Option6" name="F_Option6" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项7</th>
                <td class="formValue">
                    <input id="F_Option7" name="F_Option7" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项8</th>
                <td class="formValue">
                    <input id="F_Option8" name="F_Option8" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项9</th>
                <td class="formValue">
                    <input id="F_Option9" name="F_Option9" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">选项10</th>
                <td class="formValue">
                    <input id="F_Option10" name="F_Option10" type="text" class="form-control" placeholder="" />
                </td>
            </tr>
        </table>
    </div>
</form>